/* 地点列表 */
var Pager = require("../address/page.js");
var PlaceItem = require("./item.js");
var PlaceDetail = require("./detail.js");
var Tool = require("../common/tool.js");
var Place = React.createClass({
    getInitialState:function(){
        return {
            pageNum:"",
            placeList:[], // 地点列表
            hoverItem:[],
            zrt:'',
        }
    },

    componentDidMount:function(){
        this.getPlaceList(1);
    },

    // page切换- 父组件传递方法给子组件调用。或者redux?
    select:function(page){
        // alert('paged'+ page);
        // 根据翻页重新请求数据。
        var self = this;
        this.getPlaceList(page);
        
    },

    // 请求地点列表
    getPlaceList:function(page){
        var self = this;

        if(page==2){
            Tool.get('/place/page2', {page:page}).then(function(data){
                self.setState({
                    placeList: data.locations.list,
                    pageNum:data.locations.pages
                })
            });
        }else{
            Tool.get('/place/all', {page:page}).then(function(data){
                self.setState({
                    placeList: data.locations.list,
                    pageNum:data.locations.pages
                })
            });
        }
    },
    clickItem:function(item){
        this.setState({
            hoverItem:item,
            zrt:item.id,
        })
    },  
    render: function(){
        var self=this;
        return (
            <div className="m-place">
                <div className="list-left">
                <p>Place</p>
                {
                    this.state.placeList.map(function(item){
                        var current = item.id === self.state.zrt ? 'zrt':'none';
                        
                        return (<PlaceItem address={item} onClick={self.clickItem} current={current}/>)
                    })
                }
                </div>
                <PlaceDetail address={this.state.hoverItem} />
                <Pager total={this.state.pageNum} select={this.select}/>
            </div>
        )
    }
});

module.exports = Place;